<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:insert="~{include :: header('文库列表')}" />
    <th:block th:insert="~{include :: bootstrap-table-css}" />
</head>
<body class="hold-transition">
<!-- Site wrapper -->
<div class="container-fluid mb-2">
    <div class="toolbar" id="toolbar" role="group">
        <form id="formId" class="form-inline">
            <a class="btn btn-success mr-1" id="btn-add">
                <i class="fa fa-upload"></i> 上传资料
            </a>
            <input type="text" class="form-control mr-1" placeholder="id/标题" name="search"/>
            <select name="typeId" class="form-control mr-1">
                <option value="">类型</option>
                <option th:each="item:${types}" th:value="${item.ordinal}" th:text="${item.title}"></option>
            </select>
            <select name="status" class="form-control mr-1">
                <option value="">状态</option>
                <option value="0">未审核</option>
                <option value="1">已通过</option>
                <option value="-1">已驳回</option>
            </select>
            <button type="button" class="btn btn-primary mr-1" onclick="$.table.search()">
                <i class="fa fa-search"></i> 搜索
            </button>
            <button type="button" class="btn btn-warning" onclick="$.form.reset()">
                <i class="fa fa-refresh"></i> 重置
            </button>
        </form>
    </div>
    <div class="row">
        <div class="col-sm-12">
            <table id="bootstrap-table" class="table-striped"></table>
        </div>
    </div>
</div>
<th:block th:insert="~{include :: footer}" />
<th:block th:insert="~{include :: bootstrap-table-js}" />
<script th:inline="javascript">
    var prefix = "/document";
    $(function() {
        var options = {
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            url: prefix + "/list.json",
            modalName: "文库",
            columns: [
                {
                    field: 'id',
                    title: 'id'
                },
                {
                    field: 'cover',
                    title: '封面',
                    width: '80px',
                    align: 'center',
                    formatter: function(value, row, index) {
                        if (value === "" || value == null) {
                            return "<img class='img-circle img-xs' style='height:50px;width:50px' data-target='self' src='/static/logo-big.png'/>"
                        } else {
                            return $.common.sprintf("<img class='img-circle img-xs' height='50' width='50' data-target='self' src='%s'/>",  value);
                        }
                    }
                },
                {
                    field: 'title',
                    title: '标题'
                },
                {
                    field: 'categoryName',
                    title: '分类'
                },
                {
                    field: 'userName',
                    title: '上传人',
                    formatter: function(value, row, index) {
                        return value + "(" + row.userId + ")";
                    }
                },
                {
                    field: 'fileSize',
                    align: 'center',
                    title: '文件大小',
                    formatter: function(value, row, index) {
                        return parseInt(value / 1024)+"KB";
                    }
                },
                {
                    field: 'fileExt',
                    align: 'center',
                    title: '拓展名'
                },
                {
                    field: 'price',
                    align: 'center',
                    title: '价格',
                    formatter: function(value, row, index) {
                        return "<span class='text-red'>￥"+parseInt(value / 100)+"</span>";
                    }
                },
                {
                    field: 'status',
                    align: 'center',
                    title: '状态',
                    formatter: function(value, row, index) {
                        switch (value) {
                            case -1:
                                return "<span class='badge badge-secondary'>已驳回</span>"
                            case 0:
                                return "<span class='badge badge-danger'>未审核</span>"
                            case 1:
                                return "<span class='badge badge-primary'>已通过</span>"
                            default:
                                return "-"
                        }
                    }
                },
                {
                    field: 'createTime',
                    title: '上传时间'
                },
                {
                    title: '操作',
                    width: '180px',
                    formatter: function(value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-info btn-xs " href="javascript:void(0)" onclick=documentView(\'' + row.id + '\')><i class="fa fa-search"></i>详情</a> ');
                        actions.push('<a class="btn btn-success btn-xs" href="javascript:void(0)" onclick="documentEdit(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                       /*
                       * 隐藏删除功能，有必要才放开
                       * actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="deleteDocument(\'' + row.id + '\')"><i class="fa fa-remove"></i>删除</a> ');
                       */
                        return actions.join('');
                    }
                }]
        };
        $.table.init(options);
    });

    //详情
    function documentView(id) {
        var index = layer.open({
            title: '详情',
            content: prefix+"/view.html?id="+id,
            type: 2,
            shade: 0.2,
            maxmin: true,
            shadeClose: true,
            area: ['99.5%','99.5%']
        });
    }

    $('#btn-add').click(function (){
        var index = layer.open({
            title: '上传资料',
            content: prefix+"/add.html",
            type: 2,
            shade: 0.2,
            maxmin: true,
            shadeClose: true,
            area: ['85%','90%']
        });
    })

    //编辑
    function documentEdit(id) {
        var index = layer.open({
            title: '编辑资料',
            content: prefix+"/edit.html?id="+id,
            type: 2,
            shade: 0.2,
            maxmin: true,
            shadeClose: true,
            area: ['85%','90%']
        });
    }

    //删除
    function deleteDocument(id) {
        table.set()
        $.modal.confirm("删除资料操作不可逆转，确认要删除吗", function () {
            var data = {"id": id};
            $.operate.submit(prefix+"/remove.json", "post", "json", data);
        });
    }
</script>
</body>
</html>